<!DOCTYPE html>
<html lang="en">

<head>
    <title>书刊管理</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="../css/base.css" />
    <link rel="stylesheet" href="../css/login.css" />
    <link rel="stylesheet" href="../plugins/layui/css/layui.css">
    <link rel="stylesheet" href="../plugins/layer/skin/layer.css">
    <link rel="stylesheet" href="../plugins/elementui/index.css">
    <link rel="stylesheet" href="../plugins/bootstrap/css/bootstrap.css">
    <link rel="stylesheet" href="../css/home.css">
    <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="../plugins/font/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css">

</head>

<body>
    <div id="main">
        <!-- 整体 -->
        <el-container :style="main_style">
            <!-- 右边导航栏 -->
            <el-aside width="200px" style="background-color: rgb(238, 240, 243)">
                <el-menu :default-openeds="['0', '3']">

                    <el-submenu index="0">
                        <template slot="title"><i class="el-icon-menu"></i><a href="home.html">首页</a></template>
                    </el-submenu>

                    <el-submenu index="1">
                        <template slot="title"><i class="el-icon-message"></i>管理</template>

                        <el-menu-item-group v-if="user.role=='管理员'">
                            <template slot="title">管理用户及书刊</template>
                            <el-menu-item index="1-1">
                                <a href="user-manage.html">用户管理</a>
                            </el-menu-item>
                            <el-menu-item index="1-2"><a href="news-manage.html">书刊管理</a></el-menu-item>
                        </el-menu-item-group>


                        <el-menu-item-group title="管理个人信息" v-if="user.role=='用户'||user.role=='管理员'">
                            <el-menu-item index="1-3"><a href="user-info.html">用户管理</a></el-menu-item>
                        </el-menu-item-group>
                    </el-submenu>

                    <el-submenu index="2" v-if="user.role=='用户'||user.role=='管理员'">
                        <template slot="title"><i class="el-icon-menu"></i>订阅</template>
                        <el-menu-item-group>
                            <el-menu-item index="2-1"><a href="news-order.html">报纸订阅</a></el-menu-item>
                        </el-menu-item-group>
                    </el-submenu>

                    <el-submenu index="3" v-if="user.role=='用户'||user.role=='管理员'">
                        <template slot="title"><i class="el-icon-setting"></i>订单</template>
                        <el-menu-item-group v-if="user.role=='管理员'">
                            <template slot="title">全部</template>
                            <el-menu-item index="3-1"><a href="all-order.html">全部订单</a></el-menu-item>
                        </el-menu-item-group>

                        <el-menu-item-group v-if="user.role=='用户'||user.role=='管理员'">
                            <template slot="title">个人</template>
                            <el-menu-item index="3-2"><a href="my-order.html">个人订单</a></el-menu-item>
                        </el-menu-item-group>

                    </el-submenu>
                </el-menu>
            </el-aside>

            <!-- 右边的块 -->
            <el-container>
                <!-- 上边用户操作 -->
                <el-header style="text-align: right; font-size: 12px">
                    <el-dropdown>
                        <i class="el-icon-setting" style="margin-right: 15px"></i>
                        <el-dropdown-menu slot="dropdown">
                            <el-dropdown-item><a href="user-info.html">修改密码</a></el-dropdown-item>
                            <el-dropdown-item><a href="user-info.html">个人中心</a></el-dropdown-item>
                            <el-dropdown-item><a href="javascript:;" @click="logout()">注销</a></el-dropdown-item>
                        </el-dropdown-menu>
                    </el-dropdown>
                    <span>{{user.userName}}</span>
                </el-header>

                <!-- 主界面 -->
                <el-main style="padding: 0;">
                    <div id="app">

                        <div class="app-container">
                            <div class="box">

                                <el-form ref="updateUserForm" :model="updateForm" label-width="80px">
                                    <el-form-item label="id">
                                        <el-input :disabled="true" v-model="updateForm.id"></el-input>
                                    </el-form-item>
                                    <el-form-item label="用户名">
                                        <el-input :disabled="true" v-model="updateForm.userName"></el-input>
                                    </el-form-item>
                                    <el-form-item label="身份">
                                        <el-input :disabled="true" v-model="user.role"></el-input>
                                    </el-form-item>
                                    <el-form-item label="密码">
                                        <el-input :disabled="isUpdate" v-model="updateForm.password"></el-input>
                                    </el-form-item>
                                    <el-form-item label="邮箱">
                                        <el-input :disabled="isUpdate" v-model="updateForm.email"></el-input>
                                    </el-form-item>
                                    <el-form-item label="手机号码">
                                        <el-input :disabled="isUpdate"  v-model="updateForm.telephone"></el-input>
                                    </el-form-item>
                                    <el-form-item label="个人描述">
                                        <el-input :disabled="isUpdate"  v-model="updateForm.description"></el-input>
                                    </el-form-item>

                                    <el-form-item>
                                        <el-button type="primary" @click="handleUpdate">修改</el-button>
                                        <el-button type="primary" @click="update()">提交</el-button>
                                    </el-form-item>
                                </el-form>


                            </div>
                        </div>


                    </div>
                </el-main>

            </el-container>
        </el-container>

    </div>


    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script type="text/javascript" src="../plugins/layui/layui.js"></script>
    <script type="text/javascript" src="../plugins/layer/layer.js"></script>
    <script src="../js/vue.js"></script>
    <script src="../js/axios-min.js"></script>
    <script src="../plugins/elementui/index.js"></script>
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
    <script src="../plugins/bootstrap/js/bootstrap.js"></script>
    <script type="text/javascript" src="../js/user-info.js"></script>

    <script>
    </script>
</body>

</html>